<template>
    <div class="lay-login-wrap">
        <el-dialog title="提示" :visible.sync="dialogIsLoginVisible" width="20%" :before-close="closeIsLoginDialog">
            <p>当前账号未登录，请前往登录</p>
            <div class="btn">
                <a :href="ciipWebUrl+ '/login?redirectUrl=' + locationHref">登录</a>
            </div>
        </el-dialog>
    </div>
</template>

<script lang="ts">
import {
    Vue,
    Watch,
    Prop,
    Emit,
    Component
} from 'nuxt-property-decorator'
import {
    State,
    Mutation
} from 'vuex-class'
import {ciipWebUrl} from '../../../config/server.url.conf'
@Component({
    name: 'test',
    components: {}
})
export default class PageTest extends Vue {
    dialogIsLoginVisible: Boolean = false
    locationHref: String = ''
    ciipWebUrl: String = ciipWebUrl
    @Prop({
        default: false,
        type: Boolean
    }) isFlag !: Boolean
    @Watch('isFlag', {immediate: true})
    isFlagFn (bol: any) {
        if (bol) {
            this.dialogIsLoginVisible = bol
        }
    }
    closeIsLoginDialog () {
        this.dialogIsLoginVisible = false
        this.$emit('callBackDialog', this.dialogIsLoginVisible)
    }
    mounted () {
        if (window.location) {
            this.locationHref = window.location.href
        }
    }
}
</script>
<style lang="scss" scoped>
    .lay-login-wrap{
        p{
            padding-bottom: 20px;
            text-align: left;
        }
        .btn{
            text-align: right;
            a{
                display: inline-block;
                width: 100px;
                height: 40px;
                border-radius: 3px;
                text-align: center;
                line-height: 40px;
                background: #11a9e8;
                color: #fff;
            }
        }
    }
</style>
